<template>
  <view class="anchor_data">
    <!-- 根据主播数据是否为空来判断是否居中显示添加新主播按钮 -->
    <view class="addzb" @tap="addzb" v-if="haszbdata == 0">
      <i class="iconfont icon-tianjia"></i>
      <text style="color:grey">添加新主播</text>
    </view>
    <view class="zbdata" v-else>
      <view class="tit">
        <view>
          <text>抖音账号</text>
        </view>
        <view>
          <text>真实姓名</text>
        </view>
        <view>
          <text>收益金额</text>
        </view>
        <view>
          <text>音浪</text>
        </view>
      </view>

      <view v-for="item in zbdata" :key="item.createtime">
        <view class="zbdataItem">
          <view>
            <text class="third_anchorId">{{ item.third_anchorId }}</text>
          </view>
          <view>
            <text class="anchor_name">{{ item.anchor_name }}</text>
          </view>
          <view>
            <text class="money">{{ item.money }}</text>
          </view>
          <view>
            <text class="ticket">{{ item.ticket }}</text>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import sPullScroll from "../../s-pull-scroll";
export default {
  components: {
    sPullScroll
  },
  data() {
    return {
      // 主播收入数据信息
      zbdata: [],
      // 是否有主播收益数据
      haszbdata: 0,
      date: "",
      page: ""
    };
  },
  props: {
    showadd: Boolean
  },
  mounted() {
    this.getZbdata();
  },
  onshow() {
    this.getZbdata();
  },
  methods: {
    // 获取主播收益数据
    getZbdata(date) {
      if (date == undefined) {
        date = "";
      }
      const that = this;
      that
        .$http({
          url: "/api/anchor/AnchorData",
          data: { date: date, page: this.page }
        })
        .then(res => {
          if (res.code == 401) {
            // 未登录状态，跳转到授权页
            uni.reLaunch({
              url: "/pages/authorise/index"
            });
          }
          if (res.data.length != 0) {
            that.haszbdata = 1;
          } else {
            that.haszbdata = 0;
          }
          that.zbdata = res.data;
        });
    },
    addzb() {
      // 查询是否授权过发送订阅消息，如果没有，就申请
      wx.getSetting({
        withSubscriptions: true,
        success: res => {
          if (!res.itemSettings) {
            wx.requestSubscribeMessage({
              tmplIds: ["s9VZRLowEfxSJTxZa87luz7bt8AduXrcYCU8PCooiLA"],
              success(res) {
                console.log("res", res);
              },
              fail(err) {
                console.log("err1", err);
              }
            });
          }
        },
        fail: err => {
          console.log("err2", err);
        },
        complete: () => {}
      });
      this.$emit("changshow", true);
    },
    refresh() {
      this.$nextTick(() => {
        this.$refs.pullScroll.refresh();
      });
    },
    pullDown(pullScroll) {
      setTimeout(() => {
        this.loadData(pullScroll);
      }, 200);
    },
    loadData(pullScroll) {
      this.getZbdata();
      pullScroll.success();
    }
  }
};
</script>

<style lang='scss' scoped>
.anchor_data {
  .addzb {
    color: red;
    text-align: center;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    line-height: 1;
    .icon-tianjia {
      font-size: 100px;
    }
  }
  .zbdata {
    width: 100%;
    .tit {
      width: 100%;
      text-align: center;
      view {
        width: 25%;
        float: left;
        height: 60px;
        line-height: 60px;
      }
    }
    .zbdataItem {
      width: 100%;
      text-align: center;
      view {
        width: 25%;
        float: left;
        color: #8b8ba9;
        height: 30px;
        line-height: 30px;
      }
    }
  }
}
</style>